<template>
  <div class="wrap">
    <pro-table
      ref="proTableInst"
      tableTitle="审核列表"
      :columns="columns"
      :request="fetchTaskPage"
    ></pro-table>

    <pro-dialog
      v-model:showDialog="taskModalShow"
      :modalProps="modalProps"
      :width="1200"
      :showButton="true"
      confirmButtonText="确定"
      :showConfirmButton="handleType !== 'detail'"
      :cancelButtonText="handleType === 'detail' ? '关闭' : '取消'"
      :contentStyle="{ 'padding-left': '10px', 'padding-right': '10px' }"
      :button-loading="confirmLoading"
      @handleConfirm="taskConfirm"
      @afterClosed="
        () => {
          resetTaskForm()
        }
      "
      v-bind="$attrs"
    >
      <pro-form
        ref="taskFormInst"
        v-model:form="taskForm"
        :formProps="formProps"
        :options="options"
      ></pro-form>
    </pro-dialog>
  </div>
</template>

<script lang="ts" setup name="Task">
  import { ProTableInst } from '@/components/pro-table/type'
  import { ProFormInst } from '@/components/pro-form/type'
  import {
    useTaskApi,
    useTaskProForm,
    useTaskProTable,
    useFormOptionsList
  } from './hooks'
  import { TaskModel } from '@/api/model/task-model'

  const proTableInst = ref<ProTableInst | null>(null)
  const taskFormInst = ref<ProFormInst | null>(null)

  const formProps = computed(() => {
    return {
      labelPlacement: 'left',
      labelWidth: currentRow.value.taskType === '6' ? '160px' : '100px'
    }
  })

  const taskModalShow = ref(false)
  const handleType = ref<'check' | 'detail' | ''>('')
  const handleTag = computed(() =>
    handleType.value === 'check' ? '审核' : '详情'
  )
  const currentRow = ref<any>({})

  const modalProps = computed(() => {
    return {
      showIcon: false,
      title: handleTag.value
    }
  })
  const { taskForm, resetTaskForm } = useTaskProForm()

  const { userInfo } = getUserInfo()
  const { fetchGetOrgList, orgOptions, orgLoading } = useGetOrgList()

  // 是否为调入申请
  const isInAllocate = computed(() => {
    return currentRow.value?.receiveBranchId === userInfo.value.orgId
  })
  // 是否为借入申请
  const isInBorrow = computed(() => {
    return currentRow.value?.receiveBranchId === userInfo.value.orgId
  })

  const options = computed(() => {
    let option
    switch (currentRow.value.taskType) {
      case '0':
        option = budgetFormOptions.value
        break
      case '1':
        option = purchaseFormOptions.value
        break
      case '2':
        option = receiveFormOptions.value
        break
      case '3':
        option = borrowFormOptions.value
        break
      case '4':
        break
      case '5':
        option = scrapFormOptions.value
        break
      case '6':
        option = allocateFormOptions.value
        break
      case '7':
        option = easterFormOptions.value
        break
    }
    return option
  })

  const {
    purchaseFormOptions,
    budgetFormOptions,
    receiveFormOptions,
    scrapFormOptions,
    easterFormOptions,
    allocateFormOptions,
    borrowFormOptions,
    fetchGetReceiveList
  } = useFormOptionsList({
    handleType,
    taskForm,
    userInfo,
    orgOptions,
    orgLoading,
    isInAllocate,
    isInBorrow
  })

  const taskConfirm = async () => {
    if (await taskFormInst.value?.handleSubmit()) {
      await fetchApproveTask(currentRow.value, taskForm.value)
      taskModalShow.value = false
    }
  }

  const {
    fetchTaskPage,
    // fetchAddOrEditTask,
    fetchDelTask,
    fetchApproveTask,
    confirmLoading,
    fetchGetDetail
  } = useTaskApi({
    handleType,
    handleTag,
    taskModalShow,
    taskForm,
    isInAllocate,
    isInBorrow,
    proTableInst,
    currentRow
  })

  const handleCheck = async (row: TaskModel, type: 'detail' | 'check') => {
    currentRow.value = row
    handleType.value = type
    await fetchGetDetail(row)
    taskModalShow.value = true
  }

  const { columns } = useTaskProTable({
    fetchDelTask,
    handleCheck,
    isInAllocate,
    isInBorrow,
    userInfo
  })

  watch(taskModalShow, (val) => {
    if (val && currentRow.value.taskType === '2')
      fetchGetReceiveList(
        handleType.value === 'check',
        taskForm.value?.typeId ? parseInt(taskForm.value.typeId) : undefined
      )
  })
</script>

<style lang="less" scoped></style>
